<!--
 * @Author: zhw 443844039@qq.com
 * @Date: 2025-07-31 23:49:28
 * @LastEditors: zhw 443844039@qq.com
 * @LastEditTime: 2025-08-09 23:31:54
 * @FilePath: \project\lingyuxx-jxjsdad\ruoyi-ui\src\views\system\document\TheDetail.vue
 * @Description: 文档管理详情页面

-->
<template>
  <el-dialog
    :title="title"
    :visible.sync="visible"
    width="60%"
    :before-close="handleClose"
    :destroy-on-close="true"
    :modal="true"
  >
    <el-descriptions title="" :column="2" :border="true">
      <el-descriptions-item label="标题">{{ pageForm.wordTitle }}</el-descriptions-item>
      <el-descriptions-item label="所属类别">{{ pageForm.categoryName }}</el-descriptions-item>
      <el-descriptions-item label="所属学院">{{ pageForm.collageId }}</el-descriptions-item>
      <el-descriptions-item label="所属专业">{{ pageForm.majorId }}</el-descriptions-item>
      <el-descriptions-item label="描述" :span="2">{{ pageForm.description }}</el-descriptions-item>
      <el-descriptions-item label="附件">
        <FileUpload v-model="pageForm.fileId" :disabled="true" :isShowTip="false" :fileInfo="pageForm.fileInfo"/>
      </el-descriptions-item>
    </el-descriptions>
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取消</el-button>
    </div>
  </el-dialog>
</template>
<script>
import {downloadUserDocumentByIdApi, systemDocumentByIdApi} from '@/api/system/document'
import FileUpload from "@/components/FileUpload";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  components: {FileUpload},
  name: 'DocumentDetail',
  data() {
    return {
      title: '详情',
      pageForm: {
        wordTitle: '',
        deptId: '',
        description: '',
        categoryName: '',
        categoryid: '',
        fileId: '',
        collageId: '',
        majorId: '',
        wordId: ''
      },
      rules: {
        wordTitle: [
          {required: true, message: '请输入标题', trigger: 'change'},
        ]
      },
      visible: false,
      disabled: false,
      loading: false,
      deptOptions: [],
    }
  },
  watch: {
    // 当弹窗关闭时重置表单
    visible(val) {
      if (!val) {
        this.$nextTick(() => {
          this.$refs.formRef?.resetFields()
        })
      }
    }
  },
  methods: {
    // 打开弹窗
    handleOpen(obj) {
      this.pageForm = Object.assign({}, this.pageForm, obj);
      this.visible = true;
      this.getSystemDocumentById();
    },

    handleClose() {
      this.visible = false;
      this.pageForm = Object.assign({}, {})
    },

    async getSystemDocumentById() {
      try {
        const res = await systemDocumentByIdApi(this.pageForm.wordId)
        const {
          wordId,
          wordTitle,
          deptId,
          description,
          categoryId,
          fileId,
          collageId,
          majorId,
          categoryName,
          fileInfo
        } = res.data
        this.pageForm = Object.assign({}, this.pageForm, {
          wordId,
          wordTitle,
          deptId,
          description,
          categoryId,
          categoryName,
          fileId,
          collageId,
          majorId,
          fileInfo
        })
      } catch (error) {
        this.$message.error(error.message || '获取文档详情失败')
      }
    },
  }
}

</script>
<style scoped lang="scss">
::v-deep .el-descriptions-item__cell .el-descriptions-item__label .is-bordered-label {
  width: 60px;
}
</style>
